<template>
	<view class="local">
		<view class="top flex bt">
			<view class="text">
				<text>
					本地服务
				</text>
				<image src="../../static/icon/dingwei.png" mode="" class="dingwei"></image>
			</view>
			<view class="more" @click="goLocalMore">
				<text>
					查看更多
				</text>
				<image src="../../static/icon/right.png" mode="" class="rightpic"></image>
			</view>
		</view>
		<card :dataList="datalist" :isDate="true" @onclickHandler="clickHandler"></card>
	</view>
</template>

<script>
	import card from "../carditem/carditem.vue"
	export default {
		name: "localservice",
		props: ["localData"],
		data() {
			return {
				datalist: []
			};
		},
		methods: {
			goLocalMore() {
				uni.navigateTo({
					url: '/subpack/localmore/localmore'
				})
			},
			clickHandler(item, index) {
				// console.log(item._id,'id')
				uni.navigateTo({
					url: '/subpack/localdetail/localdetail?id=' + item._id
				})
			},
			format(arr) {
				for (let i = 0; i < arr.length; i++) {
					let item = arr[i]
					let img = item.swiperList[0]
					this.datalist.push({
						...item,
						img
					})
				}
			}
		},
		components: {
			card
		},
		mounted() {
			this.format(this.localData)
		}
	}
</script>

<style lang="scss" scoped>
	.local {
		margin-top: $uni-spacing-col-lg;

		.top {
			.text {
				color: $uni-text-color-yellow;
				font-size: $uni-font-size-lg;
				font-weight: 800;

				.dingwei {
					width: 32rpx;
					height: 32rpx;
					margin-left: $uni-spacing-col-sm;
				}
			}

			.more {
				.rightpic {
					width: 32rpx;
					height: 32rpx;
					padding-top: 10rpx;
					font-size: $uni-font-size-sm;
					color: $uni-text-color-grey;
					}
			}
		}
	}
</style>